﻿@page "/docs/components/repeater"

<Seo Canonical="/docs/components/repeater" Title="Blazorise Repeater system" Description="The repeater component is a helper component that repeats the child content for each element in a collection." />

<DocsPageTitle>
    Repeater component
</DocsPageTitle>

<DocsPageParagraph>
    The repeater component is a helper component that repeats the child content for each element in a collection.
    <br />
    <br />
    One advantage over using traditional <Code>@@foreach</Code> loop is that repeater have a full support for
    <Code>INotifyCollectionChanged</Code>. Meaning you can do custom actions whenever a data-source changes.
</DocsPageParagraph>

<DocsPageSubtitle>
    Examples
</DocsPageSubtitle>

<DocsPageSection>
    <DocsPageSectionHeader Title="Basic">
    </DocsPageSectionHeader>
    <DocsPageSectionContent Outlined FullWidth>
        <BasicRepeaterExample />
    </DocsPageSectionContent>
    <DocsPageSectionSource Code="BasicRepeaterExample" />
</DocsPageSection>

<DocsPageSubtitle>
    Attributes
</DocsPageSubtitle>

<DocsAttributes>
    <DocsAttributesItem Name="TItem" Type="generic">
        The item type to render.
    </DocsAttributesItem>
    <DocsAttributesItem Name="Items" Type="" Default="null">
        The items to render. When this is <Code>INotifyCollectionChanged</Code> it will hookup collection change listeners.
    </DocsAttributesItem>
    <DocsAttributesItem Name="Skip" Type="long?" Default="null">
        The number of items to skip before starting to render.
    </DocsAttributesItem>
    <DocsAttributesItem Name="Take" Type="long?" Default="null">
        The number of items to render.
    </DocsAttributesItem>
    <DocsAttributesItem Name="ChildContent" Type="RenderFragment<TItem>">
        The content to render per item.
    </DocsAttributesItem>
    <DocsAttributesItem Name="CollectionChanged" Type="EventCallback<NotifyCollectionChangedEventArgs>">
        Occurs when the Items collection changes.
    </DocsAttributesItem>
</DocsAttributes>